<template>
  <div id="studentinfo">
    <commonformdialog @closetextDialog="closetextDialog" :isshowconfirmbtn="false" :dialogWidth="'70%'" :enterTitle="false"
      :isshowimportTitle="false" :isshowDialogs="isshowDialog" :dialogTitle="'学员信息'" @confirmbtn='confirmbtn'
      :topHeight='"15vh"'>
      <div class="changetab">
        <div class="innerloding">
          <el-tabs v-model="activeName" @tab-click="handleClick">
            <el-tab-pane label="基础信息" name="base">
              <stuinfo :data='tableData'></stuinfo>
            </el-tab-pane>
            <el-tab-pane label="报名信息" name="apply">
              <applyinfo :data='tableData'></applyinfo>
            </el-tab-pane>
            <el-tab-pane label="费用信息" name="cost">
              <costtable :data='tableData' @getCostList='getCostList'></costtable>
            </el-tab-pane>
            <el-tab-pane label="建档信息" name="filing">
              <filingInformation :data='tableData' @getrecordList='getrecordList'></filingInformation>
            </el-tab-pane>
             <el-tab-pane label="约车记录" name="ycjl">
              <courseRecord :data='tableData' @getrecordList='getstudentGetcoursehistory'></courseRecord>
            </el-tab-pane>
            <el-tab-pane label="约考记录" name="ykjl">
              <interViewRecore :data='tableData' @getrecordList='getstudentGetexamhistory'></interViewRecore>
            </el-tab-pane>
            <el-tab-pane label="成绩信息" name="grade">
              <scoreInformation :data='tableData' @getrecordList='getrecordList'></scoreInformation>
            </el-tab-pane>
            <el-tab-pane label="换班记录" name="alteration">
              <alteration :data='tableData' @getrecordList='getrecordList'></alteration>
            </el-tab-pane>
          </el-tabs>
        </div>
      </div>
    </commonformdialog>
  </div>
</template>

<script>
  //引入弹窗
  import commonformdialog from '@/components/commondialog/commondialog'
  //基础信息
  import stuinfo from './component/stuinfo'
  //报名信息
  import applyinfo from './component/applyinfo'
  //费用信息
  import costtable from './component/costtable'
  //成绩信息
  import scoreInformation from './component/scoreInformation'
  import courseRecord from './component/courseRecord'
  import interViewRecore from './component/interViewRecore'
  //建档信息
  import filingInformation from './component/filingInformation'
  //变更记录
  import alteration from './component/alteration'
  import {
    getcostListDialog
  } from '@/api/finance'
  import {

    getReadDilog,
    getachievementlist,
    recordhistory,
    enrolldetail,
    changeCourseHistory,
    studentGetcoursehistory,
    studentGetexamhistory
  } from '@/api/student'

  export default {
    data() {
      return {
        //初始选中的项
        activeName: 'base',
        //报名信息费用数据
        tableData: null,
        id: '',
        //页码
        page: 1,
        //一页有多少条数据
        total: 5,

      }
    },
    components: {
      commonformdialog,
      stuinfo,
      costtable,
      alteration,
      applyinfo,
      scoreInformation,
      filingInformation,
      courseRecord,
      interViewRecore
    },
    props: {
      //是否显示弹窗
      isshowDialog: {
        type: Boolean,
        default: false,
      },
    },
    watch: {
      isshowDialog(isshowDialog) {

        if (isshowDialog) {
          this.id = this.$parent.studentID
          this.getReadData(this.id)
        } else {
          this.activeName = 'base'
        }
      }
    },
    methods: {
      //关闭弹窗
      closetextDialog() {
        this.$emit('closetextDialog')
      },
      //table切换
      handleClick(tab, event) {
        console.log(tab.index)
        switch (tab.index * 1) {
          case 0:
            this.getReadData();
            break;
          case 1:
            this.getenrolldetail();
            break;
          case 2:
            this.getCostList();
            break;
          case 3:
            this.getrecordhistory();
            break;
          case 4:
            this.getstudentGetcoursehistory();
            break;
            case 5:
              this.getstudentGetexamhistory();
              break;
          case 6:
            this.getrecordList();
            break;
          case 7:
            this.getchangeCourseHistory();
            break;
        }

      },
      async getReadData() {
        let data = await getReadDilog({
          id: this.id
        })
        if (data.code == '0000') {
          this.tableData = data.data;
        }
      },
      //报名信息
      async getenrolldetail() {
        let data = await enrolldetail({
          student_id: this.id
        })
        if (data.code == '0000') {
          this.tableData = data.data;
        }
      },
      //费用列表
      async getCostList(e) {
        if (e) {
          this.page = e
        }
        let params = {
          page: this.page,
          rows: this.total,
          student_id: this.id
        }
        let data = await getcostListDialog(params)
        if (data.code == '0000') {
          this.tableData = data.data;
        }
      },
      //获取成绩记录列表数据
      async getrecordList(e) {
        if (e) {
          this.page = e
        }
        let params = {
          page: this.page,
          rows: this.total,
          student_id: this.id
        }
        let data = await getachievementlist(params)
        if (data.code == '0000') {
          this.tableData = data.data;

        }
      },
      //获取建档信息
      async getrecordhistory(e) {
        if (e) {
          this.page = e
        }
        let params = {
          page: this.page,
          rows: this.total,
          student_id: this.id
        }
        let data = await recordhistory(params)
        if (data.code == '0000') {
          this.tableData = data.data;
          console.log(this.tableData)
        }
      },
      //换班记录
      async getchangeCourseHistory(e) {
        if (e) {
          this.page = e
        }
        let params = {
          page: this.page,
          rows: this.total,
          student_id: this.id
        }
        let data = await changeCourseHistory(params)
        if (data.code == '0000') {
          this.tableData = data.data;
          console.log(this.tableData)
        }
      },
        //约车记录
      async getstudentGetcoursehistory(e) {
        if (e) {
          this.page = e
        }
        let params = {
          page: this.page,
          rows: this.total,
          student_id: this.id
        }
        let data = await studentGetcoursehistory(params)
        if (data.code == '0000') {
          this.tableData = data.data;
          console.log(this.tableData)
        }
      },   //约考记录
      async getstudentGetexamhistory(e) {
        if (e) {
          this.page = e
        }
        let params = {
          page: this.page,
          rows: this.total,
          student_id: this.id
        }
        let data = await studentGetexamhistory(params)
        if (data.code == '0000') {
          this.tableData = data.data;
          console.log(this.tableData)
        }
      },
      //点击确认
      confirmbtn() {
        this.$emit('closetextDialog')
      }
    },
  }
</script>


<style scoped lang='scss'>
  ::v-deep {
    .el-tabs__item {
      font-size: 18px !important;
    }

    .el-tabs__item.is-active {
      font-weight: bold;
    }

    .el-tabs__nav-wrap::after {
      background: #fff;
    }
    .changetab{
      min-height: 500px;
    }
  }
</style>
